
<template>
<h2>门店新增</h2>
<table class="table-bordered" border="1">
    <tr>
        <td>门店名称</td>
        <td>
            <input type="text" placeholder="请输入门店名称" v-model="model.shopName"/>
        </td>
    </tr>
    <tr>
        <td>门店电话</td>
        <td>
            <input type="text" placeholder="请输入门店电话" v-model="model.shopPhone"/>
        </td>
    </tr>
    <tr>
        <td>门店地址</td>
        <td>
            <input type="text" placeholder="请输入门店地址" v-model="model.shopAddress"/>
        </td>
    </tr>
    <tr>
        <td>门店Logo</td>
        <td>
            <img :src="model.shopLogo" style="width: 50px; height: 50px;"/>
            <input type="file" @change="upload" />
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <input type="button" value="提交" class="btn btn-success" @click="Add"/>
        </td>
    </tr>
</table>
</template>
<script setup lang="ts">
import { ref} from 'vue'
import axios from 'axios'
import { useRouter } from 'vue-router';

const router=useRouter()
//门店信息实体
const model=ref({
    shopName:'',
    shopPhone:'',
    shopAddress:'',
    shopLogo:''
})
//提价门店信息
const Add=()=>{
    var obj={
        shopName:model.value.shopName,
        shopPhone:model.value.shopPhone,
        shopAddress:model.value.shopAddress,
        shopLogo:model.value.shopLogo
    }
    if(!obj.shopName){
        alert('门店名称不能为空')
        return;
    }
    if(!obj.shopPhone){
        alert('门店电话不能为空')
        return;
    }
    if(!obj.shopAddress){
        alert('门店地址不能为空')
        return;
    }
    if(obj.shopAddress.length<=6){
        alert('地址输入必须大于6个字符')
        return;
    }
    axios.post('https://localhost:7000/api/Shop/ShopAdd',obj)
    .then(res=>{
        if(res.data==-1){
            alert("门店名称不能重复");
        }
        else if(res.data>0){
            alert('提交成功');
            router.push({name:'ShopShow'})
        }
        else{
            alert('提交失败');
        }
    })
}
//上传图片
const file=ref(null)
const upload=(e:any)=>{
    file.value=e.target.files[0];
    if(file.value==null){
        alert('请选择图片')
        return;
    }
    const formData=new FormData();
    formData.append("file",file.value)
    axios.post('https://localhost:7000/api/Shop/UpLoad',formData)
    .then(res=>{
        if(res.data.num==2){
            alert(res.data.message);
        }
        else if(res.data.num==3){
            alert(res.data.message);
        }
        else if(res.data.num==1){
            alert(res.data.message);
            model.value.shopLogo=res.data.path;
        }
    })
    .catch(err=>{
        console.log(err);
    })
}

</script>

